<template>
    <div :style="'height: ' + contentHeight + 'px;'">
      <jm-head ref="head"></jm-head>
        <van-cell-group>
            <van-cell title="推荐人信息" value="查看" is-link v-if="$store.state.userInfo.pid !== 1" @click="$router.push({path: 'recommend'})" />
            <van-cell center title="头像" size="larze">
                <template #right-icon>
                    <van-icon :name="$store.state.userInfo.avatar" style="displan:block;width: 48px;" />
                    <!-- <i class="van-icon van-icon-arrow van-cell__right-icon"></i> -->
                </template>
            </van-cell>
            <van-cell title="昵称" :value="$store.state.userInfo.nickname === '' ? '未填写' : $store.state.userInfo.nickname"/>
            <van-cell title="姓名" :value="$store.state.userInfo.true_name === '' ? '未填写' : $store.state.userInfo.true_name"/>
            <van-cell title="手机号" :value="$store.state.userInfo.phone"/>
            <van-cell title="微信号" :value="$store.state.userInfo.weixin === '' ? '未填写' : $store.state.userInfo.weixin" is-link @click="goWechat" />
            <van-cell title="设置登录密码" is-link :value="$store.state.userInfo.password === ''? '未设置' : '已设置'" @click="goPassword" />
            <van-cell title="设置支付密码" is-link :value="$store.state.userInfo.password_pay === ''? '未设置' : '已设置'" @click="$router.push({path: '/password/pay'})" />
            <van-cell title="转账" is-link @click="$router.push({path: '/transfer'})" v-if="$store.state.userInfo.is_partner == 1"/>
        </van-cell-group>
        <van-cell-group title="账号状态">
            <van-cell class="logout" is-link size="large" @click="logout">
                退出登陆
                <template #right-icon>
                </template>
            </van-cell>
        </van-cell-group>
    </div>
</template>
<script>
    import store from '@/store'
    import { removeToken } from '@/utils/auth'
    import { Dialog } from 'vant'
    import JmHead from '../head/head'
    import Vue from 'vue'
    import { Cell, CellGroup, Icon } from 'vant';

    Vue.use(Cell).use(CellGroup).use(Icon)
    export default {
        name: 'setting',
        components: {
            JmHead
        },
        data () {
            return {
                contentHeight: 0,
            }
        },

        methods: {
            goNickname() {
                this.$router.push({path: '/setting/nickname'})
            },
            goName() {
                this.$router.push({path: '/setting/name'})
            },
            goWechat() {
                this.$router.push({path: '/setting/wechat'})
            },
            goPhone() {
                this.$router.push({path: '/setting/phone'})
            },
            goPassword() {
                this.$router.push({path: '/setting/password'})
            },
            goAvatar() {
                this.$router.push({path: '/setting/avatar'})
            },
            logout() {
                Dialog.confirm({
                  message: '确认退出？',
                }).then(() => {
                    removeToken()
                    const storeId = this.$store.state.userInfo.store_id
                    this.$router.push({path: '/login', query: {storeId}})
                }).catch(() => {
                })
            }
        },

        mounted() {
          console.log("父组件window.innnerHeight"+window.innerHeight)
            this.contentHeight = window.innerHeight
        },

        activated() {
            this.$store.dispatch('getUserInfo')
            this.$refs.head.setNavBarUrl()
        }
    }
</script>
<style>
.van-icon .van-icon__image{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #ccc;
}
.logout .van-cell__value--alone {
    text-align: center;
}
</style>
